<!DOCTYPE html>

<head>
    <meta name='viewport' content='width=device-width, initial-scale=1' charset="utf-8" />
    <title>yobot用户信息</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.11/vue.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.19.2/axios.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/element-ui/2.13.0/index.js"></script>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/element-ui/2.13.0/theme-chalk/index.css">
</head>

{% if user.qqid != visitor and visitor.authority_group > 100 %}{# 不是本人且不是管理员 -#}
<body>
    <h1>yobot用户信息</h1>
    <p>你无权查看这个页面</p>
    <p><a href="#" onClick="javascript:history.go(-1);">返回</a></p>
</body>
{%- else %}{# 本人或管理员 -#}
<body>
    <div id="app">
        <el-page-header @back="location='..'" content="yobot用户信息"></el-page-header>
    <p :hidden="edit">用户名：[[ nickname ]]<el-button type="primary" size="mini" icon="el-icon-edit" @click="edit=true" circle></el-button></p>
    <p :hidden="!edit">用户名：<el-input v-model="nickname" placeholder="昵称"></el-input><el-button type="success" size="mini" icon="el-icon-check" @click="edit_nickname" circle></el-button></p>
    <p>用户权限：[[ authtype[{{ user.authority_group }}] ]]</p>
    <p>公会战所在群：{{ user.clan_group_id }}</p>
    <p>上次登录时间：[[ from_ts({{ session.get('last_login_time') }}) ]]</p>
    <p>上次登录ip地址：{{ user.last_login_ipaddr }}（[[ addr.join('') ]]）</p>
</div>
</body>
<script>
    var vm = new Vue({
        el: '#app',
        data: {
            addr: [],
            nickname: '{{ user.nickname }}',
            edit: false,
            authtype: {
                1: '主人',
                2: '机器人管理员',
                10: '公会战管理员',
                100: '成员',
            },
        },
        mounted() {
            var thisvue = this;
            axios.get('{{ url_for("yobot_api_iplocation", ip=user.last_login_ipaddr) }}').then(function (res) {                
                thisvue.addr = res.data;
            }).catch(function (error) {
                console.log(error);
                thisvue.addr = ['未知'];
            });
        },
        methods: {
            edit_nickname: function(event){
                var thisvue = this;
                axios.put('{{ url_for("yobot_user_info_nickname", qqid=user.qqid) }}',{nickname: thisvue.nickname}).then(function (res) {
                    thisvue.edit = false;
                }).catch(function (error) {
                    alert('改名失败');
                    console.log(error);
                })
            },
            from_ts: function(ts) {
                if (ts == 0) {
                    return '-';
                }
                var nd = new Date();
                nd.setTime(ts * 1000);
                return nd.toLocaleString('chinese', { hour12: false });
            },
        },
        delimiters: ['[[', ']]'],
    })
</script>
{%- endif %}

</html>
